import {converFunction} from "./Chart";
import { ECHARTS_ALL_LIB_URL } from "../../Url";

class ChartBuilder {
    constructor() {
    }
    renderChartDatas(chartDatas:any) {
        let chartIds = "";
        const echarts = (window as any).echarts;
        const ecStat = (window as any).ecStat;
        for (const key in chartDatas) {
            if (chartIds.length > 0) chartIds += ",";
            chartIds += key;
            const option = chartDatas[key];
            const clear = option._clear;
            setTimeout(() => {
                const dom = document.getElementById(key);
                if (!dom) return;
                const instance = echarts.init(dom);
                echarts.registerTransform(ecStat.transform.regression);
                delete option.height;
                delete option.width;
                option.key = key;
                if (clear) {
                    instance.setOption(option, true);
                    return;
                } 
                try {
                    converFunction(option, false);
                } catch(e) {
                    console.log(e);
                }
                const links = option.links;
                delete option.links
                instance.setOption(option);
                instance.on('click', function (params:any) {
                    if (params.componentType!='series') return;

                    links.forEach(function (link:any) {
                        const linkTarget = JSON.parse(JSON.stringify(link));
                        for(let i=0;i<linkTarget.parameters.length;i++){
                            const p=linkTarget.parameters[i];
                            if (p.value=='$seriesName') {
                                p.value = params.seriesName;
                            } else if (p.value=='$name') {
                                p.value = params.name;
                            } else if (p.value=='$percent') {
                                p.value = params.percent;
                            } else if (p.value.indexOf('$value.')>-1) {
                                    p.value = params.value[p.value.substr('$value.'.length)];
                            } else if (p.value.indexOf('$value[')>-1) {
                                const lastIndex = p.value.indexOf("]");
                                const index = p.value.substr('$value['.length, lastIndex-'$value['.length);
                                p.value = params.value[index];
                            } else if (p.value=='$value' || p.value==null) {
                                p.value = params.value;
                                if (params.value instanceof Array) {
                                    const baskreport = (window as any).baskreport;
                                    if (!baskreport.chartOptions) {
                                        baskreport.chartOptions = {};
                                    }
                                    const option = baskreport.chartOptions[key];
                                    const series = option.series[params.seriesIndex];
                                    if (series.coordinateSystem && series.coordinateSystem=='cartesian2d'){
                                        if (series.type=='scatter' || series.type=='effectScatter') {
                                            p.value = params.value[1];
                                        } else {
                                            let yAxisIndex = 0;
                                            if (series.yAxisIndex) {
                                                yAxisIndex = series.yAxisIndex;
                                            }
                                            const yAxis = option.yAxis[yAxisIndex];
                                            if (yAxis.type=='value') {
                                                p.value = params.value[1];
                                            }
                                            let xAxisIndex = 0;
                                            if (series.xAxisIndex) {
                                                xAxisIndex = series.xAxisIndex;
                                            }
                                            const xAxis = option.xAxis[xAxisIndex];
                                            if (xAxis.type=='value') {
                                                p.value = params.value[0];
                                            }
                                        }
                                    }
                                    else if (series.coordinateSystem && series.coordinateSystem=='polar'){
                                        const radiusName = series.encode.radius;
                                        p.value = params.value[radiusName];
                                    }
                                }
                            }
                        }
                        //processLink(linkTarget);
                    });
                });
            }, 10);
        }
        (window as any).chartIds = chartIds;
        (window as any).chartDatas = chartDatas;
    }

    renderChart(baseUrl:string, chartDatas:any) {
        if (!chartDatas) return;
        const that = this;
        const chartLibLoaded = (window as any).chartScriptLoaded;
        if (!chartLibLoaded) {
            that.loadScript(baseUrl+"/"+ECHARTS_ALL_LIB_URL, function () {
                (window as any).chartScriptLoaded = true;
                that.renderChartDatas(chartDatas);
            });
        } else {
            that.renderChartDatas(chartDatas);
        }
    }

    destroy() {
    }

    loadScript(url:string, callback:any) {
        const newScript = document.createElement('script');
        if (callback) newScript.onload = callback;
        document.head.appendChild(newScript);
        newScript.src = url;
    }
}

export default new ChartBuilder();